<template>
    <div>
        <div class="mui-numbox" data-numbox-min="1" :data-numbox-max="nub">
					<button class="mui-btn mui-btn-numbox-minus" type="button">-</button>
					<input id="test" class="mui-input-numbox" type="number" value="1" @change="countChanged" ref="numbox">
					<button class="mui-btn mui-btn-numbox-plus" type="button" disabled="">+</button>
		</div>
    </div>
</template>
<script>

export default {
    data(){
        return{

        }
    },
    mounted(){
        mui('mui-numbox').numbox()
    },
    methods:{
        countChanged(){
            //每当文本框的数据改变的时候，立即将最新的数据 通过事件调用传递给父组件
            // ref 获取dom元素的
            // console.log(this.$refs.numbox.value)
            // this.$refs.numbox.value 数量值 传过去
            this.$emit('getData',parseInt(this.$refs.numbox.value))
        },
       
    },
     props:['nub']
}
</script>
<style scoped>
.mui-numbox{
    margin-left:5px;
    width: 105px;
    height: 30px;

}
</style>


